<template>
  <Form :label-width="110" label-position="right" :model="searchForm" ref="searchForm">
    <Row>
      <Col :span="6">
        <FormItem label="名称" prop="name">
          <Input/>
        </FormItem>
      </Col>
      <Col :span="6">
        <FormItem label="名称" prop="name">
          <Input/>
        </FormItem>
      </Col>
      <Col :span="6">
        <FormItem label="名称" prop="name">
          <Input/>
        </FormItem>
      </Col>
      <Col :span="6">
        <FormItem label="名称" prop="name">
          <Input/>
        </FormItem>
      </Col>
    </Row>
    <Row>
      <Col :span="6">
        <FormItem label="名称" prop="name">
          <Input/>
        </FormItem>
      </Col>
      <Col :span="6">
        <FormItem label="名称" prop="name">
          <Input/>
        </FormItem>
      </Col>
      <Col :span="6">
        <FormItem label="名称" prop="name">
          <Input/>
        </FormItem>
      </Col>
      <Col :span="6">
        <FormItem label="名称" prop="name">
          <Input/>
        </FormItem>
      </Col>
    </Row>
    <Row>
      <Col :span="18">
        <Button type="primary" @click="showAddModal">
          新增
        </Button>
        <Button style="margin-left: 10px;" type="error" @click="batchDelete">
          批量删除
        </Button>
        <auth-button style="margin-left: 10px;" type="error"
                     code="batchDel" @on-click="handleClick" title="授权测试" />
      </Col>
      <Col :span="6" style="text-align: right">
        <Button style="margin-right: 10px;" type="primary" @click="search">
          查询
        </Button>
        <Button @click="reset">
          重置
        </Button>
      </Col>
    </Row>
  </Form>

</template>
<script>
export default {
  data() {
    return {
      searchForm: {
        name: ''
      }
    }
  },
  methods: {
    reset() {
      this.$refs.searchForm.resetFields()
    },
    search() {
      this.$emit("search")
    },
    showAddModal() {
      this.$emit("show-add-modal")
    },
    batchDelete() {
      this.$emit("batch-delete")
    },
    handleClick() {
      console.log("handle click")
    }
  }
}
</script>
